<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>定期事件-新增</title>
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css?20190817.1">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>
    <script type="text/javascript" src="../../js/jquery/jquery-1.9.1.js"></script>
    <script src="../../js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/layui/layui/js/baseCode/base.js?v=2019072018:09" type="text/javascript" charset="utf-8"></script>
    <script src="/js/jquery/jquery.cookie.js"></script>
    <script src="/lib/layui/layui/js/common.js?v=20190723" type="text/javascript" charset="utf-8"></script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .center{
            text-align: center;
        }
        .title{
            width: 100%;
            height:36px;
            line-height:36px;
            background-color: #eeeeee;
            margin: 15px auto;
        }
        .title span{
            font-weight:bold;
            margin-left: 6px;
        }
        .Required{
            color:red;
        }
        #addTableDiv{
            padding:10px 0;
        }
        #typeTab{
            margin: 0 auto;
            table-layout: fixed;
            width:100%;
            font-weight: normal;
            font-family: '宋 体';
            border-collapse:collapse;
        }
        .Device_information{
            margin: 0 auto 10px auto;
        }
        .layui-form{
            width: 100%;
            margin: 0 auto;
        }
        #layui-form {
            display: none;
        }
        .tabs{
            margin-bottom:30px;
        }
        .layui-form-label {
            width: 104px !important;
            padding: 9px 0px;
        }
        .layui-form .one{
            width: 100%;
            display: flex;
            flex-flow: row wrap;
            justify-content: space-around;
        }
        .layui-form-item{
            width: 48%;
            margin-left: 2%;
        }
        .layui-form-label{
            width:64px;
        }
        .layui-input-block{

        }
        select{
            width: 100%;
            height: 38px;
        }
        input::-webkit-input-placeholder {
            color: #aab2bd;
        }
        .buttonbottom button{
            background-color: #009284;
            width: 90px;
            margin-top: 30px;
        }
        .layui-treeSelect .ztree li span.button.root_open:before, .layui-treeSelect .ztree li span.button.root_close:before{
            content: "\e623";
        }
        .layui-form-selectup dl {
            top: 42px;
            bottom: unset;
        }
        input[name='updateName'],input[name='updateTime']{
            cursor:not-allowed;
            background: #f1f1f5;
        }
    </style>
</head>
<body>
<div class="mbox">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="formTest" action="">
                <input type="text" name="equipId" id="layui-form">
                <div class="title"><span>添加检定校准计划</span></div>
                <div class="one calibration_plan">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span class="Required">*</span>维护频率：</label>
                        <div class="layui-input-block">
                            <select name="frequency" lay-verify="required" class="frequency">
                                <option value=""></option>
                                <option value="1">每两年</option>
                                <option value="2">每年</option>
                                <option value="3">每月</option>
                                <option value="4">每季度</option>
                                <option value="5">每周</option>
                                <option value="6">每天</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">提前提醒天数：</label>
                        <div class="layui-input-block">
                            <input type="text" name="remindDays"  placeholder="请输入提前提醒天数" autocomplete="off" class="layui-input remindDays" oninput="value=value.replace(/[^\d]/g,'')">
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span class="Required">*</span>选择部门：</label>
                        <div class="layui-input-block">
                            <select name="deptId" lay-filter="deptIdNo" class="deptId">
                                <option value="">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><span class="Required">*</span>上次执行时间：</label>
                        <div class="layui-input-block">
                            <input type="text" name="lastExeTime"  placeholder="请输入上次执行时间" autocomplete="off" class="layui-input lastExeTime">
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label" style=""><span class="Required">*</span>送检形式：</label>
                        <div class="layui-input-block">
                            <input type="text" name="inspectform"  placeholder="请输入送检形式" lay-verify="required" autocomplete="off" class="layui-input inspectform">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">捡定/校准单位：</label>
                        <div class="layui-input-block">
                            <input type="text" name="company"  placeholder="请输入捡定/校准单位" autocomplete="off" class="layui-input company">
                        </div>
                    </div>
                </div>
                <div class="one">
                    <div class="layui-form-item">
                        <label class="layui-form-label" id="userId" name="">添加人：</label>
                        <div class="layui-input-block">
                            <input type="text" name="updateName"   placeholder="请输入添加人" readonly="readonly" autocomplete="off" class="layui-input updateName">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">添加日期：</label>
                        <div class="layui-input-block">
                            <input type="text" name="updateTime" id="updateTime" placeholder="请输入" autocomplete="off" class="layui-input updateTime">
                        </div>
                    </div>
                </div>
            </form>

                <%--表格--%>
                <div class="title"><span>设备信息</span></div>
                <div class="btn Device_information">
                    <button type="button"  class="layui-btn layui-btn-sm selected">选择设备</button>
                    <%--<button type="button"  class="layui-btn layui-btn-sm addjyk">删除</button>--%>
                </div>

                <div class="tr_tds layui-table tabs" border="1" id="typeTab"></div>

                <%--检定/校准参数及允许的最大误差--%>
                <div class="title"><span>检定/校准参数及允许的最大误差</span></div>

                <div class="addtabs">
                    <button data-type="0" id="addTableButton" class="layui-btn layui-btn-sm" lay-event="add">添加</button>
                </div>
                <div id="addTableDiv" class="layui-card-body" >
                    <table id="addTable" lay-filter="addTableFilter"></table>
                </div>
                <div class="layui-card-body">
                    <table id="Settlement" lay-filter="SettlementFilter"></table>
                </div>
        </div>
    </div>
</div>


<%--第二表格删除--%>
<script type="text/html" id="addTableDel">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del2">删除</a>
</script>
<script type="text/javascript">
    var equippenter = parent.equipIdes   //调取父页面的下拉树id
    var addseleId   //定义添加部门id
    var data=[];
    // var typedata;
    var childTableData='';//选择设备table
    layui.use(['form', 'layer','table','laydate','transfer', 'layer', 'util','eleTree','element','code','laytpl','soulTable'], function() {
        var form = layui.form;
        var layer = layui.layer;
        var table = layui.table;
        tableData=table;
        var laydate = layui.laydate;
        var transfer = layui.transfer;
        var util = layui.util;
        var treeSelect = layui.treeSelect;
        var $ = layui.jquery;
        $("#updateTime").val(nowformat);  //添加日期默认当前时间

        laydate.render({
            elem: '#updateTime'
            , trigger: 'click'//呼出事件改成click
            , format: 'yyyy-MM-dd'
        });
        laydate.render({
            elem: '.lastExeTime'
            , trigger: 'click'//呼出事件改成click
            , format: 'yyyy-MM-dd'
        });

        //监听select得id
        form.on('select(deptIdNo)', function(data){
            addseleId = data.value;
        });

        //选择设备页面
        $('.selected').click(function (){
            if($('.deptId').val()==""){//验证 选择部门  是否为空
                layer.msg('请选择部门', {icon: 2});
            }else{
                layer.open({
                    type: 2
                    , area: ['95%', '95%']
                    , title: '选择设备'
                    , btn: ['确定', '取消']
                    , maxmin: true
                    , content: '/LimsEquipEventsPlan/selectEvent'
                    , yes: function (index, layero) {

                        var tableData = $(layero).find("iframe")[0].contentWindow.typedata;  //获取子页面的变量
                        var equipId='';
                        var checkStatus = tableData.checkStatus('Settlement'); //Settlement 即为基础参数 id 对应的值
                        for(var i = 0;i<checkStatus.data.length;i++){
                            equipId+=checkStatus.data[i].equipId+','//拼接 选中的设备id
                        }
                        if(equipId!=''){
                            table.render({
                                elem: '#typeTab'
                                ,url: '/equipment/showEquipByIds' //数据接口
                                ,method:'post'
                                ,where: {ids: equipId} //如果无需传递额外参数，可不加该参数
                                ,cols: [[ //表头
                                    {field: 'equipName', title: '设备名称', fixed: 'left'}
                                    ,{field: 'equipStatuasId', title: '设备状态'}
                                    ,{field: 'equipNo', title: '固定资产编号'}
                                    ,{field: 'factoryNo', title: '出产编号'}
                                    ,{field: 'modelNo', title: '型号'}
                                ]]
                                ,response: {
                                    statusName: 'code' //规定数据状态的字段名称，默认：code
                                }
                                ,done:function () {
                                    childTableData=table.cache['typeTab']
                                }
                            });
                            layer.close(index);
                        }else{
                            layer.msg('请勾选设备', {icon: 2});
                            return false
                        }
                    }
                    ,done:function(res){

                    }
                })
            }

        })

        /* 添加检定校准计划--选择部门下拉选择*/
        if(addbtn='add'){
            $.ajax({
                url: '/equipmentScrapping/showUserAndDept',
                type: 'post',
                dataType: 'json',
                success: function (res) {
                    $select = $("select[name='deptId']")
                    var optionStr = '';
                    if(res.data[1].length>0){
                        for (var i = 0; i < res.data[1].length; i++) {
                            var datass = res.data[1][i];
                            var deptName = datass.deptName;
                            deptIds = datass.deptId
                            optionStr += '<option  value="' + deptIds + '">' + deptName + '</option>'
                        }
                        $select.append(optionStr)
                        $('.updateName').val(res.data[0].userName);//添加人name
                        $('#userId').attr('name',res.data[0].userId);//添加人ID
                        form.render('select');
                    }
                }
            })
        }

        //设备信息--初始化
        table.render({
            elem: '#typeTab'
            ,data:[]
            ,cols: [[ //表头
                {field: 'equipName', title: '设备名称',fixed: 'left'}
                ,{field: 'equipStatuasId', title: '设备状态'}
                ,{field: 'equipNo', title: '固定资产编号'}
                ,{field: 'factoryNo', title: '出产编号'}
                ,{field: 'modelNo', title: '型号'}
            ]]
        });

         //检定/校准参数及允许的最大误差 表格
        table.render({
            elem: '#addTable'
            ,data:[{}]
            ,cols: [[ //表头
                {type: 'numbers', title: '序号',}
                , {field: 'paraName', title: '参数名称', edit:true}
                , {field: 'initialValue', title: '测量点', edit:true}
                , {field: 'error', title: '允许的误差',edit:true}
                , { width: 240, title: '操作', align: 'center', toolbar: '#addTableDel'}
            ]]
            ,done:function (obj) {
            }

        });

        //添加按钮点击事件
        $("#addTableButton").click(function () {
            var type=$(this).attr("data-type");
            if(type=="0"){
                //代表还未点击过添加
                // data=[];//置空，默认一个
                // table.reload('addTable',{
                //     data : data
                // });
                var $addTable=$("#addTableDiv");//得到第二个实例
                $addTable.css("display","block");
                $(this).attr("data-type","1");
                $("#addTableButton").click();
            }else{
                data =  table.cache["addTable"];
                var data1={                  //特殊初始赋值
                    paraName :"",
                    initialValue:"",
                    error:""
                };
                data.push(data1);
                table.reload('addTable',{
                    data : data
                });
            }
        });

        //删除 检定/校准参数及允许的最大误差行
        table.on('tool(addTableFilter)',function (obj) {
            var layEvent = obj.event; //获得 lay-event 对应的值
            var datatr = obj.data;//获取行数据
            var tr = obj.tr;
            var me=$(this);

            if(layEvent=='del2'){
                var index=tr.attr("data-index");
                obj.del(tr);
                data =  table.cache["addTable"];
                data.splice(parseInt(index),1);
                table.reload('addTable',{
                    data : data
                });
                var trs=$("#addTableDiv").find(".layui-table-body").find("tr");
                if(trs.length==0){//代表最后一个已经被删除
                    closeTable();
                }
            }
        });

        //关闭方法
        function closeTable() {
            $("#addTableButton").attr("data-type","0");
            var $addTable=$("#addTableDiv");//得到第二个实例
            $addTable.css("display","none");
            $("#saveTbleButton").css("display","none");
        }

    })

    //将毫秒数转为yyyy-MM-dd格式时间
    function format(t) {
        var str = "";
        var nnow = new Date(t);
        var year = nnow.getFullYear();
        var month = nnow.getMonth() + 1;
        var day = nnow.getDate();
        str = year + "-" + month + "-" + day;
        return str;
    }
    //获取当前时间  年月日
    function nowformat() {
        var  nstr = "";
        var now = new Date();
        var nyear = now.getFullYear();
        var nmonth = now.getMonth()+1;
        var nday = now.getDate();
        if(nmonth<10){
            nmonth = "0"+nmonth;
        }
        if(nday<10){
            nday = "0"+nday;
        }
        nstr = nyear+"-"+nmonth+"-"+nday;
        return nstr;
    }

    //获取  添加检定校准计划 表单数据
    function getRepairDate(){
        var experience = {};
        experience.frequency = $('.frequency').val();//维护频率
        experience.remindDays = $('.remindDays').val();//提前提醒天数
        experience.deptId = $('.deptId').val();//选择部门
        experience.lastExeTime = $('.lastExeTime').val();//上次执行时间
        experience.inspectform= $('.inspectform').val();//送检形式
        experience.company = $('.company').val();//捡定/校准单位
        experience.updateName = $('.updateName').val();//添加人
        experience.updateTime = $('.updateTime').val();//添加日期
        experience.userId = $('#userId').attr('name');//添加人ID
        return experience;
    }
</script>
</body>
</html>